<template>
  <div class="infinite-container bgwhite">
    <div v-show="result === 'ok'" class="resultBox">
      <img src="../assets/images/icon_zfcg.png" alt="">
      <p>恭喜！支付成功</p>
      <div class="saveBtn">
        <mu-raised-button class="submit-btn" v-if="toApp == 1" :label="backName" :href="backPath" fullWidth primary/>
        <mu-raised-button class="submit-btn" v-else :label="backName" :to="backPath" fullWidth primary/>
      </div>
    </div>
    <div v-show="result === 'fail'" class="resultBox">
      <img src="../assets/images/icon_zfsb.png" alt="">
      <p>对不起！支付失败</p>
      <div class="saveBtn">
        <mu-raised-button class="submit-btn" v-if="toApp == 1" :label="backName" :href="backPath" fullWidth backgroundColor="#F7A945"/>
        <mu-raised-button class="submit-btn" v-else :label="backName" :to="backPath" fullWidth backgroundColor="#F7A945"/>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        result: '',
        backName: '',
        backPath: '',
        toApp: ''
      }
    },
    mounted () {
      let info = this.$route.query
      this.result = info.result
      this.backName = info.backName
      this.backPath = info.backPath,
      this.toApp = info.toApp
    },
    methods: {}
  }
</script>

<style scoped lang="less" scoped>
  @import "../common/css/vars";
  @import "../common/css/flex.css";
.resultBox{
  padding-top:60px;
  text-align: center;
  img{
    width:100px;
  }
  p{
    font-size:20px;
    color:@color-normal;
    margin-top:20px;
  }
}
</style>
